/**
 * Created by ckl on 2017/7/5.
 */

//_HEAD_GLOBAL_DATA 全局

// 自定义select2 指令 结合 @input 实现双向绑定
Vue.directive('select2',{
    inserted:function(el, obj){
        $(el).val(obj.value).trigger('change');
        $(el).select2().on('change',function(){
            el.val = $(this).val();
            el.dispatchEvent(new Event('input'));
        });
    }
});

// 通过颜色的id获取颜色名

// 配置 vue验证插件
var veeConfig = {
    delay: 0.5,
    locale: 'zh_CN',
    //messages: null,
    strict: true
};
Vue.use(VeeValidate,veeConfig);

//  资源对象
var lensResource = new Resource( API_LIST.LENS_LIST , Vue.http );

// 表单初始的数据
var _GLOBAL_FORM_DATA = {};

// 请求成功Code
var REQUEST_OK = 0;

new Vue({
    data: {
        _HEAD_GLOBAL_DATA: window._HEAD_GLOBAL_DATA,
        products: {},
        brand_id: null,
        refractive_id: null,
        mat_id: null,
        coating_ids: [],
        color_ids:[],
        place_id:null,
        type_id:null,
        code: null,
        second_title: '',
        first_title: '',
        promotion_sale_price: null,
        sale_price: null,
        customization: false
    },

    methods: {

        // 初始化表单数据
        initFormData: function() {
            var self = this;
            var result = lensResource.create().then(function (response) {
                return response.json();
            }).then(function (result) {
                if (result.code !== REQUEST_OK) {
                    throw Error('初始化表单数据失败，code：' + result.code);
                }
                self.products = result;
                console.dir(self);
            }).catch(function (erroe) {
                console.error(erroe);
            });
        },

        validateForm: function( scope ){
            var self = this;
            this.$validator.validateAll(scope).then(function () {
                console.dir(arguments);
                console.dir( self.$validator.errorBag );
            });
        }

    },

    filters:{
        getColorNameById: function ( colors, id ) {
            var color = _(colors).find(function (color) {
                return color.id === Number(id);
            });
            return color.color;

        }
    },

    mounted: function () {
        //初始化表单数据
        this.initFormData();
    }

}).$mount('#lens');



// new Vue({
//
//     el:"#create",
//
//     data:{
//         brands: [],
//         coatings: [],
//         colors: [],
//         places: [],
//         refractives: [],
//         materials: [],
//         types: [],
//         opto: {},
//         brand_table: [],
//
//         form:{
//             brand_id: null,
//             coating_ids: null,
//             refractive_id : null,
//             type_id: [],
//             place_id: null,
//             mat_id: null,
//             color_ids: [],
//             code:null, //商品编号
//             customization: false,
//             first_title: "",
//             second_title: "",
//             promotion_sale_price:null,
//             sale_price:null,
//             rd_upper_limit: null,
//             rd_lower_limit:null,
//             as_upper_limit:null,
//             as_lower_limit:null,
//             axial_upper_limit: null,
//             axial_lower_limit:null,
//             sale_at:"",
//             sale_end:"",
//             refund_period:null, //退款期限
//             replacement_period: null,
//             customer_reserved_income:null,
//             thumb_img: null,
//             ancestor_ratio: null, //二级分成
//             super_ratio: null, // 一级分成
//         },
//         validator : null,
//         errors : null
//     },
//
//
//
//     methods:{
//
//         // selectInput:function(event){
//         //
//         // },
//
//         handle:function(event){
//             console.dir(event);
//         },
//
//         initData:function(){
//             var self = this;
//
//             var result =  lensResource.create().then(function(response){
//                return response.json();
//             }).catch(function (erroe) {
//                 console.error(erroe);
//             });
//
//             result.then(function (result) {
//                 if( result.code !== 0 )
//                     throw new Error("初始化数据失败，code："+result.code);
//                 self.brands         = result.brands;
//                 self.coatings       = result.coatings;
//                 self.colors         = result.colors;
//                 self.places         = result.places;
//                 self.materials      = result.materials;
//                 self.types          = result.types;
//                 self.opto           = result.opto;
//                 self.brand_table    = result.brand_table;
//                 self.refractives    = result.refractives;
//             })
//
//         },
//
//         //提交表单
//
//         validateForm:function(scope){
//             // this.validator.validateAll(this).then( function(result){
//             //     if (result) {
//             //         alert('Form Submitted!');
//             //     }
//             // })
//             console.dir(this.validator)
//         }
//
//     },
//
//     watch:{
//         'form.brand_id' :function (val) {
//            this.validator.validate( 'brand_id', val );
//         },
//         'form.code' :function (val) {
//             this.validator.validate( 'code', val );
//         },
//         'form.first_title' :function (val) {
//             this.validator.validate( 'first_title', val );
//         },
//         'form.second_title' :function (val) {
//             this.validator.validate( 'second_title', val );
//         },
//         'form.promotion_sale_price': function(val){
//             this.validator.validate( 'promotion_sale_price', val );
//         },
//         'form.sale_price': function(val){
//             this.validator.validate( 'sale_price', val );
//         },
//         'form.super_ratio': function(val){
//             this.validator.validate( 'super_ratio', val );
//         },
//         'form.ancestor_ratio': function(val){
//             this.validator.validate( 'ancestor_ratio', val );
//         },
//         'form.customer_reserved_income': function(val){
//             this.validator.validate( 'customer_reserved_income', val );
//         }
//
//     },
//
//
//     created:function(){
//         this.validator = new VeeValidate.Validator();
//         this.$set(this, 'errors', this.validator.errorBag);
//
//         //添加验证规则
//         this.validator.attach('brand_id', 'required',{ prettyName: '品牌名称'  } );
//         this.validator.attach('refractive_id', 'required',{ prettyName: '折射率'  } );
//         this.validator.attach('coating_ids', 'required',{ prettyName: '镀膜'  } );
//         this.validator.attach('type_id', 'required',{ prettyName: '功能类型'  } );
//         this.validator.attach('place_id', 'required',{ prettyName: '产地'  } );
//         this.validator.attach('color_ids', 'required',{ prettyName: '颜色'  } );
//         this.validator.attach('mat_id', 'required',{ prettyName: '材质'  } );
//         this.validator.attach('brand_id', 'required',{ prettyName: '品牌名称'  } );
//         this.validator.attach('code', 'required|alpha_dash',{ prettyName: '商品编号' });
//         this.validator.attach('first_title', 'max:25|min:5', { prettyName: '主标题' });
//         this.validator.attach('second_title','max:30|min:5' ,{ prettyName: '副标题' });
//         this.validator.attach('promotion_sale_price','between:0,99999',{ prettyName:"促销价"});
//         this.validator.attach('sale_price','between:0,99999',{prettyName:"销售价"});
//         this.validator.attach('super_ratio','between:0,99',{ prettyName: '一级分成的值'  });
//         this.validator.attach('ancestor_ratio','between:0,99',{ prettyName: '二级分成的值'  });
//         this.validator.attach('customer_reserved_income','between:0,1',{ prettyName: '预留收益的值'  });
//
//     },
//
//     mounted:function(){
//
//         var self = this;
//         this.initData();
//
//         //监听文件表单
//         this.$refs['thumb_input'].addEventListener("change",function(event){
//             self.form.thumb_img = this.value;
//             console.dir(this.files);
//         });
//
//     },
//
//     beforeMount: function(){
//         // alert("dd");
//     },
//
//
// });





// 修改模块
// new Vue({
//
//     data:{
//
//         // lens_list: [],
//         products:{},
//
//         params:{
//             per_page: 10, //每页数
//             page:1, //当前页
//         },
//
//         product:null //编辑表单
//
//     },
//
//     methods:{
//
//         //请求镜片数据
//         initFormData:function () {
//             var self =  this;
//
//             lensResource.index(this.params).then(function(response){
//                 return response.json();
//             }).then(function(result){
//                 if( result.code !== REQUEST_OK ){
//                     throw new Error("请求列表镜片列表失败，code："+result.code);
//                 }
//
//                 self.products = result.products;
//                 self.products.per_page = parseInt(self.products.per_page);
//
//             }).catch(function(error){
//                 console.error(error);
//             })
//         },
//
//         changePage:function(currentPage){
//             this.params.page = currentPage;
//             this.initFormData();
//         },
//
//         changeSize:function(size){
//             this.params.per_page = size;
//             this.initFormData();
//         },
//
//         //根据索引值获取获取当前表单的数据
//         setFormData:function(id){
//           // this.product = this.products.data[index];
//
//             //根据id请求编辑数据
//             var result = lensResource.edit(id).then(function(response){
//                 return response.json();
//             }).catch(function (error) {
//                 console.error( error );
//             });
//
//             result.then( function(result){
//                 if( result.code !== REQUEST_OK ){
//                     throw Error("请求编辑数据失败, code:"+ result.code);
//                 }
//
//                 console.dir(result);
//
//             } )
//
//         }
//     },
//
//
//     mounted:function () {
//
//         //初始化表单数据
//         this.initFormData();
//
//         // alert("d")
//     },
//
//     // components:{
//     //     elPagination
//     // }
//
//
// }).$mount("#update");










